<!--
 * @Author: byron
 * @Date: 2021-10-18 08:35:55
 * @LastEditTime: 2022-02-08 01:07:37
-->
<template>
    <div id="app">
        <Layout></Layout>
    </div>
</template>

<script>
//导入主要页面布局
import Layout from '@/layout'
import config from './configure/blog.config'

export default {
    name: 'App',
    components: {
        Layout,
    },
    created() {
        //页面初始化
        let color = this.$store.getters.color
        console.log(color, '颜色')
        let height = this.$store.getters.clientHeight
        if (height == 0 || typeof undefined == 'undefined') {
            this.$store.dispatch('app/setHeight')
        }
        if (config.color !== color) {
            console.log('zheg')
            if (typeof window.less !== 'undefined') {
                window.less.modifyVars({
                    '@primary-color': color,
                    '@link-color': color,
                    '@btn-primary-bg': color,
                })
            } else {
                // 全局异步回调
                window.colorReadyCallBack = () => {
                    let loadColorTimer = setInterval(() => {
                        if (window.less && window.less.modifyVars) {
                            window.less.modifyVars({
                                '@primary-color': color,
                                '@link-color': color,
                                '@btn-primary-bg': color,
                            })
                            clearInterval(loadColorTimer)
                        }
                    }, 1)
                }
            }
        }
    },
}
</script>

<style>
img {
    width: 100%;
    height: 100%;
}
a {
    text-decoration: none;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
</style>
